<template>
  <div>
    <van-nav-bar
  title="登录"
  left-text="返回"
  
  left-arrow
  @click-left="onClickLeft"
 
/>

<div class="picture">
  <img src="@assets/photo.png" alt="">
</div>
<van-form @submit="onSubmit">
  <van-field
    v-model="username"
    name="userName"
    label="用户名"
    placeholder="用户名"
    :rules="[{ required: true, message: '请填写用户名' }]"
  />
  <van-field
    v-model="password"
    type="password"
    name="passWord"
    label="密码"
    placeholder="密码"
    :rules="[{ required: true, message: '请填写密码' }]"
  />
  <div style="margin: 16px;">
    <van-button round block type="info" native-type="submit">提交</van-button>
    <div class="register" @click="$router.push('/Adduser')">没有账号？滚去注册</div>
  </div>
</van-form>
 
  </div>
</template>

<script>
import {Toast} from 'vant'
import {loginEnter }from '@api'
  export default {
     data() {
    return {
      username: '',
      password: '',
      forbidClick:false
    };
  },
  methods: {
    onSubmit(values) {
      Toast.loading({
      message: '登录...',
      forbidClick: true,
      
      });
      console.log('submit', values);
      
      loginEnter({...values}).then(res=>{
        console.log(res.data.token);
        if(res.data.token){
        localStorage.setItem('token',res.data.token)
        console.log(this);
        this.forbidClick=false
        Toast.success("登录成功")
        this.$router.go(-1)
        }else{
          this.forbidClick=false
         Toast.fail({
           message:"账号或密码错误",
          
         })
        }
       
      })
    },
    onClickLeft(){
      this.$router.replace("/home")
    },
  },
  }
</script>

<style lang="scss" scoped>
.picture{
  padding: 60px 0;
  img{
    width: 40%;
  }
}
</style>